<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>管理员登录</title>

<link rel="stylesheet" type="text/css" href="<?php echo asset_url('js/bootstrap/css/bootstrap.min.css');?>" />
<link rel="stylesheet" type="text/css" href="<?php echo asset_url('js/bootstrap/css/bootstrap-responsive.min.css');?>" />
<script type="text/javascript" src="<?php echo asset_url('js/jquery/jquery.js');?>"></script>

<script type="text/javascript">

	$(document).ready(function(){

		$('#username').focus();

		var is_verify = false;
		$("#verify").focus(function(){
			if ( ! is_verify){
				is_verify = true;
				$(this).after('<img src="<?php echo admin_url("home/verify");?>" id="verify_image" title="看不清，换一张" onclick="this.src=\'<?php echo admin_url("home/verify");?>/\'+Math.random()" id="verify_img" />');
			}
		});
		
		$("form").submit(function(){
			var username = $("#username").val();
			var password = $("#password").val();
			var verify = $("#verify").val();
			
			if ( ! username)
			{
				alert('请输入账号！');
				$("#username").focus();
				return false;
			}
			if ( ! password)
			{
				alert("请输入密码！");
				$("#password").focus();
				return false;
			}
			if ( ! verify)
			{
				alert("请输入验证码！");
				$("#verify").focus();
				return false;
			}

			$.ajax({
				type: "POST",
				url: "__SELF__",
				data: {username:username, password:password, verify:verify},
				success: function(m){
					if (m)
					{
						alert(m);
						$("#verify").val('');
						$("#verify_img").click();
					}
					else
					{
						parent.location.href = "<?php echo admin_url('home/index');?>";
					}
				},
				error: function()
				{
					alert('error');
				}
			});
			return false;
		});

	});
</script>

<style type="text/css">

#login {
	position: relative;
	width: 200px;
	height: 250px;
	margin: 0 auto;
	margin-top: 150px;
	border: 1px solid #ccc;
	border-radius: 3px;
	padding: 30px 130px;
}

#title {
	text-align: center;
}

#username, #password {
	width: 200px;
}

#verify {
	width: 100px;
}

#verify_image {
	position: absolute;
	top: 210px;
	left: 250px;
	cursor: pointer;
}

</style>

</head>
<body>

<div id="login">
	<form onsubmit="return false;">
		<h2 id="title">管理员登录</h2>
		<div>
			<label for="username">账号：</label>
			<input type="text" id="username" autocomplete="off" />
		</div>
		<div>
			<label for="password">密码：</label>
			<input type="password" id="password" />
		</div>
		<div>
			<label for="verify">验证码：</label>
			<input type="text" id="verify" />
		</div>
		<div>
			<input type="submit" value="登 录" class="btn" />
		</div>
	</form>
</div>

</body>
</html>